﻿
@{
    ViewBag.Title = "登录统计";
    Layout = "~/Views/Shared/_Layout.cshtml";
}


<div class="title-content">登录统计</div>
<div class="row" style="margin-left:0px;margin-right:0px;">
    <div class="col-md-12">
        <!-- BEGIN EXAMPLE TABLE PORTLET-->
        <div class="portlet light ">
            <div class="portlet-body">

                <div class="dataTables_wrapper no-footer">
                    <div class="row">
                        <div class="col-md-6 col-sm-6" style="width:30%">
                            <div class="dataTables_length" id="sample_1_length">
                                <label>
                                    显示条数 <select id="changePageSize" onchange="pageSizeChange()" class="form-control input-sm input-xsmall input-inline">
                                        <option value="10">10</option>
                                        <option value="20">20</option>
                                        <option value="50">50</option>
                                    </select>
                                </label>

                                <label>
                                    &nbsp; 版本 <select id="visions" onchange="pageSizeChange()" class="form-control input-sm input-xsmall input-inline">
                                        <option value="1">家园版</option>
                                        <option value="2">园丁版</option>
                                    </select>
                                </label>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-6" style="width:70%">
                            <div id="sample_1_filter" class="dataTables_filter">
                                <div class="col-md-6" style="width:40%">
                                    <div class="input-group input-sm date date-picker" style="margin-top:-7px" data-date-format="yyyy-mm-dd" data-date-end-date="" id="startTimes">
                                        <input type="text" id="stime" class="form-control" placeholder="开始时间" onchange="setMinTime(1)">
                                        <span class="input-group-btn">
                                            <button class="btn default" type="button">
                                                <i class="fa fa-calendar"></i>
                                            </button>
                                        </span>
                                    </div>
                                </div>
                                <div class="col-md-6" style="width:40%">
                                    <div class="input-group input-sm date date-picker" style="margin-top:-7px" data-date-format="yyyy-mm-dd" data-date-end-date="" id="endTimes">
                                        <input type="text" id="etime" class="form-control" placeholder="结束时间" onchange="setMinTime(2)">
                                        <span class="input-group-btn">
                                            <button class="btn default" type="button">
                                                <i class="fa fa-calendar"></i>
                                            </button>
                                        </span>
                                    </div>
                                </div>
                                <div style="float:left; width:16%">
                                    <button type="button" class="btn btn-sm blue" onclick="GridData()">查找<i class="fa fa-search"></i></button>
                                </div>
                            </div>
                        </div>
                        <div class="table-scrollable">
                            <table class="table table-striped table-bordered table-hover order-column dataTable no-footer" align="center" role="grid" aria-describedby="sample_1_info">
                                <thead>
                                    <tr role="row">
                                        <th class="td-text-center"> 幼儿园</th>
                                        <th class="td-text-center"> 总登陆 </th>
                                        <th class="td-text-center"> 今天登陆 </th>
                                        <th class="td-text-center "> 总发布成长档案 </th>
                                        <th class="td-text-center "> 今天发布 </th>
                                        <th class="td-text-center "> 总点赞 </th>
                                        <th class="td-text-center "> 总评论 </th>
                                        <th class="td-text-center"> 详细 </th>
                                    </tr>
                                </thead>
                                <tbody id="gridTable"></tbody>
                            </table>
                            <script id="grid" type="text/html">
                                <% for(var i=0;i
                                <list.length;i++){ %>
                                    <% var item=list[i]; %>
                                    <tr class="gradeX" role="row" id="<%=item.schoolId %>">
                                        <td class="td-text-center">&nbsp;<%=item.schoolName %></td>
                                        <td class="td-text-center">&nbsp;<%=item.loginCount %></td>
                                        <td class="td-text-center">&nbsp;<%=item.DayCount %></td>
                                        <td class="td-text-center ">&nbsp;<%=item.growCount %></td>
                                        <td class="td-text-center ">&nbsp;<%=item.growDay %></td>
                                        <td class="td-text-center ">&nbsp;<%=item.zanCount %></td>
                                        <td class="td-text-center ">&nbsp;<%=item.pingCount %></td>
                                        <td class="td-text-center">
                                            <a class="btn btn-sm green" href="#stack1" onclick="loginInfo('<%= item.schoolid %>')" data-toggle="modal">详情</a>
                                        </td>
                                    </tr>
                                    <%}%>
                            </script>
                        </div>
                        <div class="row">
                            <div class="col-md-5 col-sm-5"><div class="dataTables_info" id="data_info">显示 1 到 10 共 0 条</div></div>
                            <div class="col-md-7 col-sm-7">
                                <!--加载分页控件-->
                                @Html.Partial("DataPager")
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="stack1" class="modal fade" tabindex="-1" data-focus-on="input:first" data-width="710">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        <h4 class="modal-title">个人详细</h4>
    </div>
    <div class="modal-body">
        <div style="min-height:450px; width:100%;">
            <!--加载班级列表-->
            <div>
                <table border="1" style="border-collapse:collapse;border:1px solid #e0e0e0;width:100%;font-size:10px;line-height:20px;">
                    <thead>
                        <tr>
                            <th class="banjitd" id="tNames">&nbsp;家长姓名</th>
                            <th class="banjitd teach">&nbsp;班级</th>
                            <th class="banjitd">&nbsp;手机号</th>
                            <th class="banjitd">&nbsp;总登陆</th>
                            <th class="banjitd ">&nbsp;总发布档案</th>
                            <th class="banjitd ">&nbsp;今天发布</th>
                            <th class="banjitd">&nbsp;点赞</th>
                            <th class="banjitd">&nbsp;评论</th>
                            <th class="banjitd">&nbsp;最近登陆</th>
                        </tr>
                    </thead>
                    <tbody id="banjiTBody"></tbody>
                </table>
                <script id="banjiTable" type="text/html">
                    <% for(var i=0;i
                    <list.length;i++){ %>
                        <% var item=list[i]; %>
                        <tr class="gradeX" role="row" id="<%=item.phone %>">
                            <td class="banjitd">&nbsp;<%=item.uname %></td>
                            <td class="banjitd teach">&nbsp;<%=item.className %></td>
                            <td class="banjitd">&nbsp;<%=item.phone %></td>
                            <td class="banjitd">&nbsp;<%=item.loginCount %></td>
                            <td class="banjitd ">&nbsp;<%=item.growCount %></td>
                            <td class="banjitd ">&nbsp;<%=item.growDay %></td>
                            <td class="banjitd">&nbsp;<%=item.zanCount %></td>
                            <td class="banjitd">&nbsp;<%=item.pingCount %></td>
                            <td class="banjitd">&nbsp;<%=item.times!=null?item.times.substring(0,16).replace("T"," "):"" %></td>
                        </tr>
                        <%}%>
                </script>
            </div>
        </div>
    </div>
    @*<div class="modal-footer">
            <button type="button" data-dismiss="modal" class="btn btn-outline dark">关闭</button>
            <button type="button" class="btn green">提交</button>
        </div>*@
</div>

<script>
    //加载
    $(function () {
        GridData();
    });

    //时间范围
    function setMinTime(type) {
        if (type == 1) {
            var stime = $("#stime").val();
            $("#endTimes").datepicker("setStartDate", stime);
        }
        else {
            var etime = $("#etime").val();
            $("#startTimes").datepicker("setEndDate", etime)
        }
    }

    //pageChange
    function pageSizeChange() {
        var count = $("#changePageSize").val();
        pageSize = count;
        pageIndex = 1;
        GridData();
    }
    //绑定数据
    function GridData() {
        $("#gridTable").html("");
        var stime = $("#stime").val();
        var etime = $("#etime").val();
        var vision = $("#visions").val();
        $("#tNames").html(vision=="1"?"&nbsp;家长":"&nbsp;教师");
        AjaxCustom({
            url: "/loginReport/loginReport",
            type: "post",
            showLoading: true,//是否显示遮罩层
            parames: { pageIndex: pageIndex, pageSize: pageSize, stime: stime, etime: etime, vision: vision },
            callBack: function (obj) {
                var start = (obj.data.pageIndex - 1) * pageSize + 1;
                var end = obj.data.pageIndex * pageSize;
                $("#TotalCount").html(obj.data.total);//总行数
                if (obj.data.total == 0) {
                    $("#data_info").html("");
                    $("#gridTable").html("<tr><td colspan=\"6\" style='text-align:center;'><b style='color:red;'>暂无数据</b></td></tr>");
                    document.getElementById('paging1').innerHTML = "";//分页控件代码为空
                } else {
                    if (pageIndex == obj.data.pageCount) {
                        $("#data_info").html("显示 " + start + " 到 " + obj.data.total + " 共 " + obj.data.total + " 条");
                    } else {
                        $("#data_info").html("显示 " + start + " 到 " + end + " 共 " + obj.data.total + " 条");
                    }
                    //加载数据
                    var gridData = template('grid', obj.data);
                    $("#gridTable").html(gridData);
                    //加载分页控件
                    loadPager(obj.data.pageIndex, obj.data.pageCount);
                    if (vision == "2") {    
                        $(".teach").hide();
                    }
                    else {
                        $(".teach").show();
                    }
                }
            }
        });
    }

    //查询幼儿园的情况
    function loginInfo(schID) {
        var stime = $("#stime").val();
        var etime = $("#etime").val();
        var vision = $("#visions").val();
        AjaxCustom({
            url: "/loginReport/loginInfo",
            type: "post",
            showLoading: true,//是否显示遮罩层
            parames: { schoolid: schID, stime: stime, etime: etime,vision: vision },
            callBack: function (obj) {
                if (obj.data.list.length == 0) {
                    $("#banjiTBody").html("<tr><td colspan=\"8\" style='text-align:center;'><b style='color:red;'>没有数据</b></td></tr>");
                } else {
                    //加载数据
                    var gridData = template('banjiTable', obj.data);
                    $("#banjiTBody").html(gridData);
                    if (vision == "2") {
                        $(".teach").hide();
                    }
                    else {
                        $(".teach").show();
                    }
                }
            }
        });
    }
</script>
